вертикальное выравнивание с text-overflow:ellipsis;

[Riim]

Привет. Почти как обычно: выровнять блок вертикально по центру родителя, высота блока зависит от контента, родитель должен реагировть на переполнение по Y (переполняет выравниваемый блок) увеличением высоты или появлением скролла. Можно использовать продвинутый (-webkit) css.

Проблема в том, что блок содержит детей с overflow:hidden; + white-space:nowrap; + text-overflow:ellipsis; из-за чего стандартные способы ломаются:

1. display:table-cell; + vertical-align:middle;

http://jsfiddle.net/7Ewfx/7/

не срабатывает overflow:hidden; .

2. display:flex; + align-items:center;

http://jsfiddle.net/7Ewfx/8/

не срабатывает text-overflow:ellipsis; и блок с текстом смещается влево.

3. display:box; + box-align:center;

http://jsfiddle.net/7Ewfx/9/

не срабатывает text-overflow:ellipsis; и display:box; вроде как устарел.

Должно получиться вот так: http://jsfiddle.net/7Ewfx/10/ , но чтобы зеленый блок был в центре.

Кто-нибудь знает как это сделать?

Edited May 16, 2013 by Riim

[Riim]

подсказали на другом форуме: http://jsfiddle.net/byd3c/

спасибо за внимание